<template>
	<view class="content">
		<view class="top">
			<view class="left">
				<image src="../../static/images/avatar.png" mode=""></image>
			</view>
			<view class="right">
				<view>
					昵称：尼斯湖大水逼
				</view>
				<view>
					姓名:张三
				</view>
				<view>
					电话：12235644648
				</view>
			</view>
		</view>
		<view class="bottom">
			<view class="addr">
				【收货地址】
			</view>
			<view class="addr-1" v-for="(item,index) in listAddr">
				<view class="">
					<text>{{item.name}}</text>
					<text>{{item.phone}}</text>
				</view>
				<view class="">
					<text>{{item.city}}</text>
					<text>{{item.addr}}</text>
				</view>
			</view>

			<!--新添收获地址 -->
			<view class="addAddr" @click="addAddr">
				新增地址+
			</view>
		</view>
	</view>
</template>

<script>
	import * as mydata from "../../utils/data.js"
	export default {
		data() {
			return {
				listAddr: []
			}
		},
		methods: {
			addAddr() {
				uni.navigateTo({
					url: `../addrManage/addrManage`
				})
			}
		},
		mounted() {
			this.listAddr = mydata.getPickerData()
			console.log(this.listAddr)
		},

	}
</script>

<style>
	.content {
		width: 100%;
		height: 100%;

	}

	.top {
		width: 100%;
		height: 300rpx;
		/* border: 1rpx solid #007AFF; */
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.top image {
		width: 200rpx;
		height: 200rpx;
	}

	.top .right {
		padding-left: 30rpx;
	}

	.addr {
		text-align: center;
		margin: 50rpx 0px;

	}

	.addr-1 {
		box-sizing: border-box;
		padding: 0px 80rpx;
		border-bottom: 1rpx solid #999999;
		width: 100%;
		height: 160rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		/* line-height: 160rpx; */
	}

	.addAddr {
		width: 100%;
		height: 160rpx;
		text-align: center;
		line-height: 160rpx;
		border-bottom: 1rpx solid #999999;
		color: #ff0000;
	}
</style>
